'use client'
import React from 'react'
import { Message, Upload } from '@arco-design/web-react'
import { IconAttachment } from '@arco-design/web-react/icon'
import '@arco-design/web-react/dist/css/arco.css'

type UploadIconProps = {
    onFileUpload?: (file: File) => void
    className?: string
    size?: 'small' | 'medium' | 'large'
}

const UploadIcon: React.FC<UploadIconProps> = ({
    onFileUpload,
    className = '',
    size = 'medium',
}) => {
    const handleUpload = (file: File, fileList: File[]) => {
        console.log('file', file)
        console.log('fileList', fileList)
        if (onFileUpload)
            onFileUpload(file)

        Message.success('文件上传成功')
        return true
    }

    const sizeClasses = {
        small: 'text-xs',
        medium: 'text-sm',
        large: 'text-base',
    }

    return (
        <>
        <Upload
            action='/'
            onChange={(_, currentFile) => {
                console.log('currentFile', currentFile)
            }}
            beforeUpload={handleUpload}
            showUploadList={false}
        >
            <button
                className={`flex items-center justify-center ${sizeClasses[size]} text-gray-500 hover:text-gray-700 focus:outline-none ${className}`}
                title="文件上传"
            >
                <IconAttachment className=' text-lg'/>
            </button>
        </Upload>
        <div className=''>
           
        </div>
        </>
    )
}

export default UploadIcon
